<template>
  <view>
    <view class="slot-container">
      <u--image
        :showLoading="true"
        src="../../static/images/submint.png"
        width="120rpx"
        height="146rpx"
      ></u--image>
      <view class="document-info"> {{ dialogData.title }}</view>
      <view class="document-btn">
        <u-button
          @click="handleClose"
          :customStyle="{
            boxShadow: 'none !important',
            width: '280rpx',
            height: '90rpx',
            borderRadius: '10rpx',
            color: '#0C347E',
            border: '1px solid #0C347E',
            background: '#F5F5F5',
            fontSize: '36rpx',
            borderRadius: '45rpx',
            fontWeight: 400,
            color: '#0C347E',
            marginRight: '50rpx',
          }"
        >
          {{ dialogData.btn.close }}
        </u-button>
        <u-button
          @click="submitForm"
          :customStyle="{
            boxShadow: 'none !important',
            width: '280rpx',
            borderRadius: '10rpx',
            height: '90rpx',
            color: '#FFFFFF',
            fontSize: '36rpx',
            border: '1px solid #0C347E',
            background: '#0C347E',
            borderRadius: '45rpx',
          }"
        >
          {{ dialogData.btn.ok }}</u-button
        >
      </view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    handleClose: {
      type: Function,
      default: () => {},
    },
    submitForm: {
      type: Function,
      default: () => {},
    },
    dialogData: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      title: 'Hello',
    }
  },
  onLoad() {},
  methods: {},
}
</script>

<style lang="scss" scoped>
.slot-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.document-info {
  margin-top: 24rpx;
  font-size: 36rpx;
  font-weight: 400;
  color: #383839;
  line-height: 30rpx;
}
.document-btn {
  display: flex;
  margin: 75rpx 0rpx 20rpx 0rpx;
}
</style>
